import React, { PureComponent } from "react";
import Jamap from "components/amap/JMap";
import JTab from "components/layoutc/JTab";
import SearchCarList from "../components/SearchCarList";
import AreaSearchCar from "../components/AreaSearchCar";
import "./index.less";

class index extends PureComponent {
  constructor() {
    super();
    this.state = {
      ontab: 0
    };
  }
  geTabTValue(params) {
    this.setState({ ontab: params });
  }
  carItemClick(index, item) {
    this.jmapchild.setOnMarkerHandler(item);
  }
  render() {
    return (
      <div className="container">
        <div className="left-cn">
          <div className="top">
            <div className="font-normal font-color-normal">
              当前地图中心：陕西省西安市雁塔区
            </div>
          </div>
          <div className="map-cn">
            <Jamap
              ref={child => {
                this.jmapchild = child;
              }}
            />
          </div>
        </div>
        <div className="right-cn">
          <div className="tab-cn">
            <JTab
              tabs={["车辆列表", "区域查车"]}
              onTab={this.geTabTValue.bind(this)}
            />
          </div>
          <div className="right-list">
            {this.state.ontab === 0 ? (
              <div>
                <SearchCarList carItemClick={this.carItemClick.bind(this)} />
              </div>
            ) : (
              <div>
                <AreaSearchCar carItemClick={this.carItemClick.bind(this)} />
              </div>
            )}
          </div>
        </div>
      </div>
    );
  }
}

export default index;
